<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>茶茶商城</title>
    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/fonts/fontawesome-all.min.css">
    <link rel="stylesheet" href="assets/fonts/font-awesome.min.css">
    <link rel="stylesheet" href="assets/fonts/ionicons.min.css">
    <link rel="stylesheet" href="assets/fonts/fontawesome5-overrides.min.css">
    <link rel="stylesheet" href="assets/css/animated-textbox3-1.css">
    <link rel="stylesheet" href="assets/css/animated-textbox3.css">
    <link rel="stylesheet" href="assets/css/Beautiful-Alert.css">
    <link rel="stylesheet" href="assets/css/Carousel_Image_Slider-1.css">
    <link rel="stylesheet" href="assets/css/Carousel_Image_Slider.css">
    <link rel="stylesheet" href="assets/css/Customizable-Carousel-swipe-enabled.css">
    <link rel="stylesheet" href="assets/css/Elegant-Registration-Form.css">
    <link rel="stylesheet" href="assets/css/Footer-Clean.css">
    <link rel="stylesheet" href="assets/css/Grid-and-List-view-V10-1.css">
    <link rel="stylesheet" href="assets/css/Grid-and-List-view-V10.css">
    <link rel="stylesheet" href="assets/css/Lista-Productos-Canito.css">
    <link rel="stylesheet" href="assets/css/Login-Form-Clean.css">
    <link rel="stylesheet" href="assets/css/Multi-step-form.css">
    <link rel="stylesheet" href="assets/css/Navigation-with-Search.css">
    <link rel="stylesheet" href="assets/css/Pretty-Product-List.css">
    <link rel="stylesheet" href="assets/css/Pretty-Registration-Form.css">
    <link rel="stylesheet" href="assets/css/Pretty-Search-Form.css">
    <link rel="stylesheet" href="assets/css/Product-Details.css">
    <link rel="stylesheet" href="assets/css/Registration-Form-with-Photo.css">
    <link rel="stylesheet" href="assets/css/Search-Input-Responsive-with-Icon.css">
    <link rel="stylesheet" href="assets/css/styles.css">
</head>

<body>
    <nav class="navbar navbar-light navbar-expand-md shadow-sm">
        <div class="container"><a class="navbar-brand" href="index.html">茶茶商城</a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-2"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
            <div class="collapse navbar-collapse" id="navcol-2">
                <ul class="navbar-nav ms-auto" id="nav_ul">
                    <li class="nav-item"><a class="nav-link active" href="index.html">产品</a></li>
                    <li class="nav-item"><a class="nav-link" href="cart.html">购物车</a></li>
                    <li class="nav-item"><a class="nav-link" href="order.html">我的订单</a></li>
                    <li class="nav-item"><a class="nav-link" href="login.html" id="nav_login">登录</a></li>
                    <li class="nav-item"><a class="nav-link" href="register.html" id="nav_register">注册</a></li>
                </ul>
            </div>
        </div>
    </nav>
    <div class="container" style="padding: 5px;"><div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
  <ol class="carousel-indicators">
    <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
    <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
    <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
  </ol>
  <div class="carousel-inner">
    <div class="carousel-item active">
      <img class="d-block w-100" src="img/banner_1.jpg" alt="First slide" style="height: 400px; width: 100%;">
        <div class="carousel-caption d-none d-md-block">
            <p></p>
        </div>
    </div>
    <div class="carousel-item">
      <img class="d-block w-100" src="img/banner_2.jpg" alt="Second slide" style="height: 400px; width: 100%;">        
        <div class="carousel-caption d-none d-md-block">
            <p></p>
        </div>
    </div>
    <div class="carousel-item">
      <img class="d-block w-100" src="img/banner_3.jpg" alt="Third slide" style="height: 400px; width: 100%;">        
        <div class="carousel-caption d-none d-md-block">
            <p></p>
        </div>
    </div>
  </div>
  <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </a>
  <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </a>
</div>

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script></div>
    <div class="container">
        <form class="search-form" style="margin: 8px;">
            <div class="input-group"><span class="input-group-text"><i class="fa fa-search"></i></span><input class="form-control" type="text" placeholder="输入您想寻找的商品"><button class="btn btn-primary" type="button" style="margin: auto;">查询</button></div>
        </form><div class="alert alert-success beautiful" role="alert">
    <div><strong>公告:</strong> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse sollicitudin elit massa. Class aptent taciti sociosqu ad litora torquent</div>
</div>
    </div>
    <div class="container">
        <div class="row product-list" id="row_1">

        </div>
        <div class="text-center">
            <i class="fa fa-arrow-left border rounded-circle" style="color: rgb(0,0,0);">
        </i>
        <div style="display:inline;" id="button_div">

        </div>

            <i class="fa fa-arrow-right" style="color: rgb(0,0,0);"></i>
        </div>
    </div>
    <footer class="footer-clean">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-sm-4 col-md-3 item">
                    <h3>服务</h3>
                    <ul>
                        <li><a href="#">订单查询</a></li>
                        <li><a href="#">物流查询</a></li>
                        <li><a href="#">在线客服</a></li>
                    </ul>
                </div>
                <div class="col-sm-4 col-md-3 item">
                    <h3>关于我们</h3>
                    <ul>
                        <li><a href="#">公司简述</a></li>
                        <li><a href="#">团队</a></li>
                        <li><a href="#">资产</a></li>
                    </ul>
                </div>
                <div class="col-sm-4 col-md-3 item">
                    <h3>联系我们</h3>
                    <ul>
                        <li><a href="#"><i class="fa fa-phone-square"></i><span>&nbsp; +86 15375984932</span></a></li>
                        <li><a href="#"><i class="fas fa-mail-bulk"></i><span>&nbsp;2949027426@qq.com</span></a></li>
                        <li><a href="#">福建省莆田市涵江区XXX</a></li>
                    </ul>
                </div>
                <div class="col-lg-3 item social"><a href="#"><i class="icon ion-social-facebook"></i></a><a href="#"><i class="icon ion-social-twitter"></i></a><a href="#"><i class="icon ion-social-snapchat"></i></a><a href="#"><i class="icon ion-social-instagram"></i></a>
                    <p class="copyright">Company Name © 2022</p>
                </div>
            </div>
        </div>
    </footer>
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script src="assets/js/md5.js"></script>
    <script src="assets/bootstrap/js/bootstrap.min.js"></script>
    <script src="assets/js/Customizable-Carousel-swipe-enabled.js"></script>
    <script src="assets/js/Grid-and-List-view-V10.js"></script>
    <script src="assets/js/get_json.js"></script>
    <script src="assets/js/Multi-step-form.js"></script>
    <script src="assets/js/check_login.js"></script>
</body>

</html>